﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../css/public.css">
    <title>考勤组统计</title>
    <style>
        .bg{
            background: rgb(80,131,195);
            color:#fff;
            height: 33%;
            text-align: center;
        }
        .box1{
            float:left;
            width:37%;
            height:100%;
            position:relative;
        }
        .box2{
            float:left;
            width:63%;
            height:100%;
            position:relative;
        }
        .box3{
            float:left;
            width:100%;
            height:50%;
        }
        .box4{
            float:left;
            width:33%;
            height:50%;
            position:relative;
        }
        .tleheader{
            background: rgb(75,141,250);
            color:#fff;
        }
        .layout{
            position:absolute;
            width:100%;
            height: 100%;
            left:-1px;
        }
        .pt{
            padding-top:50%;
            /*margin-top:1em;*/
        }
        .pt1{
            padding-top:25%;
            margin-top:-2em;
        }
        .pt2{
            padding-top:75%;
            margin-top:-2em;
        }
        .c1{
            color:rgb(222,222,222);
        }
        .container{
            width: 80%;
            margin:14px auto 70px;
            padding:0 10px;
            border-left: 2px solid rgb(220,220,220);
        }
        .date{
            color:rgb(150,150,150);
            padding:0.2em;
            font-size: ;
        }
        .txttitle{
            margin-top:1.5em;
            font-size: 18px;
            position: relative;
        }
        .txttitle:before{
            content:"";
            position: absolute;
            width:15px;
            height:15px;
            background: rgb(255,148,62);
            left:-18px;
            border-radius: 50%;
        }
        .fs{
            font-size: 20px;
            padding-top:4px;
        }
        .backpic{
            /*padding:0 6px;*/
        }
        .backbtn a {
            color: #fff;
            margin-left: 0;
        }
        .pdy14{
            padding:14px 0;
        }
        .fb{
            padding:0;
        }
        .section:before{
            content:"";
            position: absolute;
            width:15px;
            height:15px;
            background: rgb(255,148,62);
            left:-18px;
            bottom:100px;
            border-radius: 50%;
            z-index: 999;
        }
        .lh{
            height: 10px;
        }
    </style>
</head>
<body>
    <header class="tleheader" style="background: rgb(80,131,195);">
        <p class="backbtn"><a style="margin:0;">
            <img src="../icon/arrow/zjt.PNG" class="backpic" alt="">
            <span>返回</span></a>
        </p>
        <h1 class="tc">&nbsp;&nbsp;&nbsp;考勤组统计</h1>
        <div class="clear"></div>
    </header>
    <section class="bg pr">
        <div class="box1">
            <p class="pt c1">2016年</p>
            <p class="fs">1月</p>
        </div>
        <div class="box2">
            <div class="layout bl">
                <div class="box3">
                    <p class="pt1 c1">正常考勤</p>
                    <p class="fs">17天</p>
                </div>
                <div class="box4 bt">
                    <p class="pt2 c1">迟到</p>
                    <p class="fs">0次</p>
                </div>
                <div class="box4 bt">
                    <div class="layout bl">
                        <p class="pt2 c1">早退</p>
                        <p class="fs">0次</p>
                    </div>
                </div>
                <div class="box4 bt">
                    <div class="layout bl">
                        <p class="pt2 c1">未打卡</p>
                        <p class="fs">6次</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="clear"></div>
    </section>
    <section class="container bl">
        <p class="txttitle">范围外</p>
        <p class="date">2016-01-26 （星期二） 19：16</p>
        <p class="date">浙江省杭州市滨江区</p>

        <p class="txttitle">未打卡</p>
        <p class="date">2016-01-26 （星期二） 19:16</p>
        <p class="date">2016-01-26 （星期二） 19:16</p>
        <p class="date">2016-01-26 （星期二） 19:16</p>
        <p class="date">2016-01-26 （星期二） 19:16</p>
        <p class="date">2016-01-26 （星期二） 19:16</p>
        <p class="lh"></p>
        <p class="lh"></p>
        <p class="lh"></p>
        <p class="lh"></p>
        <p class="txttitle" style="margin-top:-12px;"></p>
    </section>

    <div class="fb">
        <a href="kqtj-gly-kqxz-4.html" class="cb">
            <div class="w50 fl pdy14">
                <b>考勤修正</b>
            </div>
        </a>
        <div class="w50 bdlml fl pdy14">
            <b>考勤设置</b>
        </div>
        <div class="clear"></div>
    </div>
    <script type="text/javascript" src="../js/back.js"></script>
</body>
</html>